<template>
  <div class="container">
    <div class="mask"
         v-if="ismark">
      <!-- 优惠券,遮罩和弹框 -->
      <div class="ticketBox"
           v-if="ticket_mark">
        <p class="title">
          可领取优惠券
          <span class="close"
                @tap="closeTicketBox">×</span>
        </p>
        <scroll-view :scroll-y="true"
                     :style="{'height': '244px;'}"
                     @scroll="scroll"
                     @scrolltolower="pullrefresh">
          <div class="list"
               v-for="(item,index) in ticket_array"
               :key="index">
            <div class="list_left">
              ¥
              <span class="amount">{{item.type_money}}</span>
              <p class="amount1">满{{item.type_min_money}}可用</p>
            </div>
            <div class="list_mid">
              <p class="text1">
                <span class="cash_ticket">{{item.source_name}}</span>
                {{item.type_name}}
              </p>
              <p class="text2">{{item.condtion_name}}</p>
              <p class="text3">{{item.start_ticket_time}}~{{item.end_ticket_time}}</p>
            </div>
            <div class="list_right"
                 @tap="beClooect(item)">
              <span class="text1"
                    v-if="item.tickets_is_set == false">立即领取</span>
              <img src="https://h5.ameimeika.com/mp_images/mp_2.0/pinzhiyimei/youchou@2x.png"
                   v-if="item.tickets_is_set == true"
                   class="icon" />
            </div>
          </div>
        </scroll-view>
      </div>
    </div>
    <!-- 分享弹窗 -->
    <swiperbox :shopid="shopid"
               :ispop="ispop"
               @getSwiperMsg="getSwiperMsg"></swiperbox>
    <ul class="tab"
        :style="{opacity:tab_opacity+''}">
      <li class="tab-item"
          v-for="(item, index) in tab_arr"
          :key="index">
        <div class="msg"
             :class="{'active':type==item.type}">{{item.msg}}</div>
      </li>
    </ul>
    <scroll-view :scroll-y="true"
                 :scroll-into-view="target"
                 :style="{'height': '100%'}"
                 @scroll="scrollTab"
                 @scrolltolower="infiniteScroll">
      <!-- 轮播图 -->
      <div id="banner">
        <swiper class="swiper"
                :indicator-dots="true"
                :autoplay="true"
                :interval="2000"
                :duration="500"
                indicator-color="rgba(255, 255,255,.5)"
                indicator-active-color="rgba(255, 255,255,1)">
          <block v-for="(item,index) in bannerImg"
                 :key="index">
            <swiper-item>
              <image :src="imgUrl+item"
                     v-if="imgUrl && item"
                     class="slide-image"
                     @tap="tapBigImg(bannerImg,index)" />
            </swiper-item>
          </block>
        </swiper>
      </div>
      <!-- <div class="plusbox">
        <div class="pluscard" v-if="mallList.plus_title">
          {{mallList.plus_title}}
          <div class="btn" @tap="beVip()" v-if="mallList.is_plus==2">立即开卡</div>
          <div class="btn1" v-if="mallList.is_plus==1">
            马上赚钱
            <button @tap.stop="show_share()" class="rightnow"></button>
          </div>
        </div>
      </div>-->
      <!-- 倒计时抢购 -->
      <div class="countdown"
           v-if="mallList.project_type!==(0 || 1)  && is_activity && mallList.activity_project!== null">
        <div class="left">
          <p class="p1"
             v-if="mallList.activity_project!==null">
            ¥
            <span class="num">{{mallList.activity_project.activity_project_price}}</span>
          </p>
          <p class="p2">
            <span class="item1">原价 ¥</span>
            <span class="item2">{{mallList.origin_price}}</span>
            <span class="jyb_details"
                  :class="mallList.deduction_method==1?'jb':'yb'"
                  v-if="mallList.deduction_method!=0&&mallList.deduction_credit>0">
              <span class="icon"></span>
              全{{mallList.deduction_method==1?'金币':'银币'}}抵扣
            </span>
            <span v-if="djs_type=='距结束倒计时'">{{mallList.appointment_peoples}}人已预约</span>
          </p>
        </div>
        <div class="right1">
          <p class="title"
             :class="minutes[0]=='00'?'style1':''">{{djs_type}}</p>
          <p class="timer">
            <span class="item"
                  v-if="minutes[0]!=='00'">{{minutes[0]}}</span>
            <span v-if="minutes[0]!=='00'"
                  class="time_style">天</span>
            <span class="item">{{minutes[1]}}</span> :
            <span class="item">{{minutes[2]}}</span> :
            <span class="item">{{minutes[3]}}</span>
          </p>
        </div>
      </div>
      <!-- 商品介绍 -->
      <div class="mall">
        <!-- 预约价项目 -->
        <div class="booking_price"
             v-if="mallList.activity_project == null && mallList.project_type == 0">
          预约价 ¥
          <span class="booking_priceNum">{{mallList.appointment_price}}</span>
          <img src="https://h5.ameimeika.com/mp_images/shangcheng/gantanhao@2x.png"
               alt
               class="bookimg"
               @tap="tips" />
        </div>
        <p class="pay_type"
           v-if="mallList.activity_project == null && mallList.project_type == 0">
          优惠价 ¥ {{mallList.discounts_range}}
          <span class="jyb_details"
                :class="mallList.deduction_method==1?'jb':'yb'"
                v-if="mallList.deduction_method!=0&&mallList.deduction_credit>0">
            <span class="icon"></span>
            <block v-if="mallList.project_price==mallList.deduction_credit">全{{mallList.deduction_method==1?'金币':'银币'}}抵扣</block>
            <block v-else>{{mallList.deduction_method==1?'金币':'银币'}}可抵{{mallList.deduction_credit}}元</block>
          </span>
        </p>
        <p class="project"
           v-if="mallList.activity_project == null && mallList.project_type == 1">
          <!-- 全款价项目 积分抵扣-->
          <span class="coin">¥</span>
          <span class="num">{{mallList.project_price}}</span>
          <!-- <span v-if="mallList.deduction_credit!==0">积分可抵¥{{mallList.deduction_credit}}</span> -->
        </p>
        <p class="pay_type"
           v-if="mallList.activity_project == null && mallList.project_type == 1">
          <!-- 全款项目 价格显示-->
          <span class="origin">
            原价
            <span style="text-decoration: line-through">¥ {{mallList.origin_price}}</span>
          </span>
          <span class="jyb_details"
                :class="mallList.deduction_method==1?'jb':'yb'"
                v-if="mallList.deduction_method!=0&&mallList.deduction_credit>0">
            <span class="icon"></span>
            <block v-if="mallList.project_price==mallList.deduction_credit">全{{mallList.deduction_method==1?'金币':'银币'}}抵扣</block>
            <block v-else>{{mallList.deduction_method==1?'金币':'银币'}}可抵{{mallList.deduction_credit}}元</block>
          </span>
        </p>
        <div class="plus_box"
             v-if="mallList.plus_title&&!isApoint">
          <div class="icon"></div>
          {{mallList.plus_title}}
        </div>
        <div class="mall_name">
          <!-- <span class="bao icon_style" v-if="mallList.insurance_is_set ==2">
            保
          </span>
          <span class="jintie icon_style" >
            津贴
          </span>-->
          {{mallList.name}}
        </div>
        <p class="mall_dec">{{mallList.descript}}</p>
        <div class="mall_bottom">
          <span>{{mallList.city}}</span>
          <span class="booked1">
            预约数
            <span style="margin-left:4px">{{mallList.appointment_peoples ==null?'0':mallList.appointment_peoples}}</span>
          </span>
        </div>
      </div>

      <!-- 促销条 -->
      <div class="promotion"
           v-if="promotions"
           @tap="toPromotion(promotions)">
        <img :src="imgUrl+promotions.image"
             alt
             class="imgs"
             v-if="imgUrl&&promotions.image" />
      </div>
      <!-- 优惠券 -->
      <div class="ticket_box">
        <div class="ticket"
             @click="toTicketDetail"
             v-if="ticket_array.length > 0">
          <span class="tic_img">优惠券</span>
          {{ticket_array.length}}张可使用
          <img src="https://h5.ameimeika.com/mp_images/jifenshangcheng/xiangqingye/xiayibu@2x.png"
               alt
               class="right" />
        </div>
        <div class="line"></div>
        <div class="ticket"
             v-if="mallList.ensure_content.length>0&&!isApoint"
             @click="ensure_detail()">
          <span class="tic_img">保障</span>
          <!-- <block v-if="mallList.insurance_is_set==2"> -->
          <span class="bz_box">
            <span class="list"
                  v-for="(item,index) in mallList.ensure_content"
                  :key="index">
              <span class="icon"></span>
              {{item}}
            </span>
          </span>

          <!-- </block> -->
          <!-- <block v-if="mallList.is_repair==1">
            <span class="icon"></span>维权
          </block>-->
        </div>
      </div>
      <!-- 医院推送 -->
      <div class="main"
           v-if="!isApoint">
        <div class="hospital"
             @click="toHospital(array.id)"
             v-if="array.hospitalIsShow == 0">
          <!-- <div class="hos">
            <img :src="imgUrl+array.logo" alt class="hospital_img" />
          </div>-->
          <div class="hos_right">
            <div class="hos_name">
              {{array.name}}
              <div class="extraLevel"
                   v-if="array.tags_name && array.tags_name!==null">
                <div class="extraLevel_item">
                  {{array.tags_name}}
                  <div class="v-tip">v</div>
                </div>
              </div>
            </div>
            <div class="address"
                 @tap.stop="toMap(array)">
              <div class="address_left">
                <img :src="imgUrl+'h5_images/mp_images/mp_3.1.6/mmk_3.1.6/ic_location.png'"
                     class="locate"
                     v-if="imgUrl" />
              </div>
              <div class="address_right">{{array.address}}</div>
              <div class="address_icon">
                <span></span>
              </div>
            </div>
          </div>
          <!-- 医院数据 -->
          <div class="hos-data">
            <div class="data-item">
              <div class="item-l">
                治疗室数量：
              </div>
              <div class="item-r">
                {{array.treatment_room_number}}
              </div>
            </div>
            <div class="data-item">
              <div class="item-l">
                医院面积：
              </div>
              <div class="item-r">
                {{array.acreage}}
              </div>
            </div>
            <div class="data-item">
              <div class="item-l">
                手术室数量：
              </div>
              <div class="item-r">
                {{array.operating_room_number}}
              </div>
            </div>
            <div class="data-item">
              <div class="item-l">
                成立时间：
              </div>
              <div class="item-r">
                {{array.establish_at}}
              </div>
            </div>
          </div>
        </div>
        <!-- <div class="hospital_details">
          <span class="listd">
            治疗室数量：
            <span class="num">2个</span>
          </span>
          <span class="listd">
            医院面积：
            <span class="num">2个</span>
          </span>
          <span class="listd">
            手术室数量：
            <span class="num">2个</span>
          </span>
          <span class="listd">
            成立时间：
            <span class="num">2个</span>
          </span>
        </div>-->
        <!-- 推荐项目 -->
        <p class="reference_project_title">项目推荐</p>
        <ul class="reference_project_ul">
          <li class="reference_project_li item"
              v-for="(item,index) in reference_project"
              :key="index"
              @click="toProjectDetail(item)">
            <span class="reference_project">
              <img :src="imgUrl+item.image"
                   alt
                   class="pro_img"
                   v-if="imgUrl && item.image" />
              <span class="buyingImg"
                    v-if="item.activity_status == 1">即将开抢</span>
              <span class="buyingImg"
                    v-if="item.activity_status == 2">抢购中</span>
            </span>

            <p class="reference_project_price"
               v-if="item.activity_status == 3 || item.activity_status ==1">
              优惠价
              <span class="appointment_price">
                ¥
                <span class="big">{{item.discounts}}</span>
              </span> 起
            </p>
            <p class="reference_project_price"
               v-if="item.activity_status==4">
              <span class="appointment_price">
                ¥
                <span class="big">{{item.project_price}}</span>
              </span>
            </p>
            <p class="reference_project_price"
               v-if="item.activity_status==2">
              <span class="appointment_price">
                ¥
                <span class="big">{{item.discounts}}</span>
              </span>
            </p>
            <span class="jyb_details"
                  :class="item.deduction_method==1?'jb':'yb'"
                  v-if="item.deduction_method!=0&&item.deduction_credit>0">
              <span class="icon"></span>
              <block v-if="item.project_price==item.deduction_credit">全{{item.deduction_method==1?'金币':'银币'}}抵扣</block>
              <block v-else>{{item.deduction_method==1?'金币':'银币'}}可抵{{item.deduction_credit}}元</block>
            </span>
          </li>
        </ul>
      </div>

      <!-- 评价 -->
      <div class="evaluation"
           id="evaluation">
        <p class="user_evaluation"
           @tap="toEvaluation_detail(mallId)">
          反馈 ({{evaluationNum}})
          <span class="check_evaluation">
            全部反馈
            <img :src="ImgBaseUrl+'/jifenshangcheng/xiangqingye/xiayibu@2x.png'"
                 v-if="ImgBaseUrl"
                 class="evaluation_icon" />
          </span>
        </p>
        <ul class="dv">
          <li v-for="(item,index) in arrayBtn"
              :key="index"
              class="dv_item"
              :class="{'active' : currentIndex === index}"
              @click="checkTime(item,index)">
            {{item.value}}
          </li>
        </ul>
        <div class="evaluation_item"
             v-for="(item,index) in evaluationList"
             :key="index"
             v-if="evaluationList&&evaluationList.length>0"
             @tap="toEvaluation_detail(mallId)">
          <div class="hos user_info">
            <img :src="imgUrl+item.headimgurl"
                 alt
                 class="user_img"
                 v-if="imgUrl && item.headimgurl" />
            <div class="user_main">
              <p class="user_name">{{item.user_name}}</p>
              <!-- <span class="evaluation_time">{{item.time}}</span> -->
              <span class="star">
                <span class="star_box">
                  <img :src="halfStar"
                       v-if="item.star==0.5 && halfStar"
                       class="little_star" />
                  <img :src="item.star>=1?allStar:noStar"
                       alt
                       class="little_star"
                       v-if="allStar && noStar && item.star" />
                  <img :src="halfStar"
                       v-if="item.star==1.5 &&halfStar"
                       class="little_star" />
                  <img :src="item.star>=2?allStar:noStar"
                       alt
                       class="little_star"
                       v-if="allStar && noStar && item.star" />
                  <img :src="halfStar"
                       v-if="item.star==2.5 && halfStar"
                       class="little_star" />
                  <img :src="item.star>=3?allStar:noStar"
                       alt
                       class="little_star"
                       v-if="allStar && noStar && item.star" />
                  <img :src="halfStar"
                       v-if="item.star==3.5 && halfStar"
                       class="little_star" />
                  <img :src="item.star>=4?allStar:noStar"
                       alt
                       class="little_star"
                       v-if="allStar && noStar && item.star" />
                  <img :src="halfStar"
                       v-if="item.star==4.5 && halfStar"
                       class="little_star" />
                  <img :src="item.star>=5?allStar:noStar"
                       alt
                       class="little_star"
                       v-if="allStar && noStar && item.star" />
                </span>
              </span>
            </div>
          </div>
          <div class="content_main">
            <p class="evaluation_content"
               :class="item.image_arr.length>0?'active':''">{{item.contents}}</p>
            <ul class="evaluationIMG"
                v-if="item.image_arr.length>0">
              <li class="evaluationIMG_li"
                  v-if="item.image_arr[0]!=='' && item.image_arr[0] !== null">
                <img :src="item.image_arr[0]"
                     alt
                     class="evaluationIMG_li_item"
                     v-if="imgUrl &&item.image_arr[0]!==''" />
              </li>
              <span class="tip">{{item.image_arr.length}}张</span>
            </ul>
          </div>

        </div>
      </div>
      <!-- 项目详情 -->

      <div class="check_img"
           id="project_detail">
        <div class="header clearfix"></div>
        <div class="imgsbox">
          <img class="imgs"
               v-for="(item,index) in goods_data2"
               mode="widthFix"
               :key="index"
               :src="item"
               alt />
        </div>
      </div>
    </scroll-view>
    <div class="bottom"
         v-if="!isApoint">
      <div class="btn">
        <div class="consult">
          <img :src="imgUrl+'h5_images/mp_images/mp_3.1.6/mmk_3.1.6/nav_ic_consultation.png'"
               alt
               v-if="imgUrl"
               class="consult_icon" /> 咨询
          <button class="contact"
                  @tap="to_service()"></button>
        </div>
        <div class="tel"
             @click="call">
          <img src="https://h5.ameimeika.com/mp_images/shangcheng/dainhua@2x.png"
               alt
               class="tel_icon" /> 电话
        </div>

        <div class="consult">
          <img :src="imgUrl+'h5_images/mp_images/mp_3.1.6/mmk_3.1.6/nav_ic_share.png'"
               alt
               v-if="imgUrl"
               class="consult_icon" /> 分享
          <button class="contact"
                  @tap.stop="show_share()"></button>
        </div>
        <span class="booking_btn"
              @tap="tobooking_detail()"
              v-text="mallList.project_type==1 || mallList.activity_project?'立即购买':'立即预约'"></span>
      </div>
    </div>
    <div class="btns clearfix"
         v-if="scrollTop < 50">
      <div class="collect"
           @tap.stop="collect()">
        <img :src="iscollect==true?ImgBaseUrl+'/mp_2.0/jifenshangcheng/shoucanghou@2x.png':ImgBaseUrl+'/mp_2.0/jifenshangcheng/shoucang--huidi@2x.png'"
             v-if="ImgBaseUrl"
             class="image"
             mode="widthFix"
             alt
             srcset />
      </div>
    </div>
    <!-- 分享 -->
    <!-- <div class="share-mask clearfix"
         v-if="show_postermask"
         @tap.stop="close_share()">
      <img :src="ImgBaseUrl+'/mp_3.0.2/share_top.png'"
           v-if="ImgBaseUrl"
           mode="widthFix"
           alt
           class="share-top" />
      <div class="share-model"
           @tap="save_poster">
        <img :src="poster_url"
             v-if="poster_url&&poster_url!=''"
             @tap.stop="()=>{false}"
             @longtap.stop="save_poster(poster_url)"
             mode="widthFix"
             alt
             class="poster" />
      </div>
    </div> -->
  </div>
</template>
<script>
import common from "@/assets/js/mmk_common.js";
import swiperbox from "@/components/swiper/swiper";
import "@/assets/js/timeFormat.js";
export default {
  components: {
    swiperbox
  },
  data () {
    return {
      imgUrl: common.image_response,
      ImgBaseUrl: common.image_resource,
      mallId: "",
      mallList: [],
      bannerImg: [],
      hospital_id: "",
      array: "", //医院信息
      evaluationList: [],
      imgArray: [],
      ticket_array: [],
      star: [],
      reference_project: [], //附带医院推荐项目
      iscollect: false, //收藏样式标记
      mallname: "",
      goods_data2: [],
      system_mark: "",
      evaluationNum: "", //评论条数
      ismark: false, //遮罩弹窗
      ticket_mark: false, //优惠券弹窗
      collected: true, //优惠券领取标记
      tab_arr: [
        {
          type: 1,
          msg: "项目"
        },
        {
          type: 2,
          msg: "详情"
        },
        {
          type: 3,
          msg: "反馈"
        }
      ],
      type: "", // 1 商品 详情 评价
      tab_opacity: 0,
      target: "",
      promotions: "", //促销条
      scrollTop: 0,
      tokenMark: false,
      sid: "",
      begin_time: "",
      end_time: "",
      date_time: "",
      time1: {},
      minutes: ["00", "00", "00", "00"],
      djs_type: "",
      project_doctors: "",
      isEnsure_content: false, //保障
      is_activity: false, //是否在活动中
      activity_project_status: "", //记录是否是抢购项目
      lat: "",
      lng: "",
      poster_url: "",
      show_postermask: false,
      arrayBtn: [
        {
          id: 3,
          value: "最新"
        },
        {
          id: 2,
          value: "好评"
        },
        {
          id: 1,
          value: "有图"
        }
      ],
      checkType: 3,
      currentIndex: 0,
      shoplist: "",
      ispop: false,
      shopid: '',
      halfStar: 'https://img.ameimeika.com/h5_images/mp_images/mp_3.1.6/mmk_3.1.6/details_ic_star_half@2x.png',
      allStar: 'https://img.ameimeika.com/h5_images/mp_images/mp_3.1.6/mmk_3.1.6/details_ic_star_s@2x.png',
      noStar: 'https://img.ameimeika.com/h5_images/mp_images/mp_3.1.6/mmk_3.1.6/details_ic_star_n@2x.png',
      isApoint: false//标记是否为从邀请有礼确认预约跳转入项目详情(页面做纯展示作用，除可查看评论外，无法做任何交互)
    };
  },
  onLoad: function (options) {
    clearInterval(this.time1);
    this.sid = wx.getStorageSync("user_id");
    this.bannerImg = "";
    this.promotions = "";
    this.project_doctors = "";
    this.isEnsure_content = false;
    this.ispop = false;
    if (options.scene) {
      let url_data = decodeURIComponent(options.scene),
        obj = {};
      url_data.split("&").forEach(item => {
        obj[item.split("=")[0]] = item.split("=")[1];
      });
      this.sid = obj.sid;
      this.mallId = obj.tg;
    }
    if (options.id) {
      this.mallId = options.id; //商城传过来的id
      this.getData(options.id);
      this.shopid = options.id //轮播组件id
      wx.setStorageSync('swiper', 1)
    }
    if (options.isApoint) {
      this.isApoint = options.isApoint;
    }
    var that = this;
    wx.getSystemInfo({
      success: res => {
        that.system_mark = res.system.slice(0, 3);
      }
    });
    if (wx.getStorageSync("user_token")) {
      that.tokenMark = false;
    } else {
      that.tokenMark = true;
    }

    wx.getLocation({
      type: "gcj02",
      success (res) {
        that.lng = res.longitude; // 经度，浮点数，范围为-180~180，负数表示西经
        that.lat = res.latitude;
      }
    });
  },
  onShow () {
    this.show_postermask = false
    this.promotions = "";
    this.project_doctors = "";
    this.minutes = "";
    this.sid = wx.getStorageSync("user_id");
    clearInterval(this.time1);
    if (wx.getStorageSync("user_token")) {
      this.tokenMark = false;
    } else {
      this.tokenMark = true;
    }
    this.poster_url = ''
    this.getData(this.mallId);
    this.GetRTime();
    this.djs();
    // this.get_poster();
  },
  onUnload () {
    // this.shopid = ''
    clearInterval(this.time1);
    this.minutes = "";
  },
  methods: {
    checkTime (item, index) {
      this.evaluationList = [];
      this.evaluationNum = 0;
      this.currentIndex = index;
      this.checkType = item.id;
      this.pageNum = 1;
      this.getEva(this.checkType);
    },
    gotoWaiter () {
      wx.navigateTo({
        //保留当前页面，跳转到应用内的某个页面
        url: "/pages/waiter/main" //url里面就写上你要跳到的地址
      });
    },
    // 跳转客服
    to_service () {
      common.to_service()
    },
    getData (e) {
      common.mmk_Loading(0);
      let obj, commentObj;
      if (wx.getStorageSync("user_id")) {
        //登录
        obj = {
          id: e,
          user_id: wx.getStorageSync("user_id")
        };
        commentObj = {
          project_id: e,
          user_id: wx.getStorageSync("user_id")
        };
      } else {
        //未登录
        obj = {
          id: e,
          user_id: 0
        };
        commentObj = {
          project_id: e,
          user_id: 0
        };
      }
      //商城项目详情
      setTimeout(() => {
        common.fly_post("api/v4_5/shop_project/show", obj, msg => {
          common.mmk_Loading(1);
          let res = msg.data;
          if (res.status_code == 0) {
            this.target = "banner";
            var reg = /(http:|https:)\/\/.*?(png|jpg)/gi;
            this.goods_data2 = res.data.content.match(reg);
            console.log(this.goods_data2);

            this.mallList = res.data;
            this.shoplist = res.data;
            // console.log(this.shoplist)
            this.mallname = res.data.name;
            if (res.data.activity_project !== null) {
              this.begin_time = res.data.activity_project.begin_time - 1;
              this.end_time = res.data.activity_project.end_time - 1;
              this.GetRTime();
            }
            if (res.data.ensure_content.length > 0) {
              this.isEnsure_content = true;
            }
            if (res.data.promotions) {
              this.promotions = res.data.promotions;
            }
            if (res.data.banner !== null && res.data.banner !== "") {
              this.bannerImg = res.data.banner.split(",");
            }
            if (res.data.hospital) {
              this.array = res.data.hospital;
            }
            // this.hospital_id = res.data.hospital_id;
            this.ticket_array = res.data.ticket; //优惠券
            this.ticket_array.forEach(element => {
              element.end_ticket_time = new Date(
                element.end_ticket_time * 1000
              ).Format("yyyy.MM.dd");
              element.start_ticket_time = new Date(
                element.start_ticket_time * 1000
              ).Format("yyyy.MM.dd");
            });
            if (res.data.project_doctors.length !== 0) {
              //项目相关医生
              this.project_doctors = res.data.project_doctors;
            }
            this.reference_project = res.data.recommand;
            this.iscollect = res.data.collect;
            wx.setNavigationBarTitle({
              title: res.data.name
            });
          } else {
            wx.showToast({
              title: res.message,
              icon: "none",
              duration: 1500,
              mask: true,
              success () {
                setTimeout(() => {
                  wx.switchTab({ url: "/pages/index/main" });
                }, 1500);
              }
            });
            return false;
          }
        });
      }, 100);
      //项目评论
      // common.fly_post("api/v4_5/shop_project/comment_home", commentObj, msg => {
      //   let res = msg.data;
      //   if (res.status_code == 0) {
      //     this.evaluationNum = res.data.total;
      //     let arr = res.data.data;
      //     arr.forEach(element => {
      //       element.time = new Date(element.time * 1000).Format("yyyy-MM-dd");
      //       if (element.images) {
      //         if (element.images.length > 3) {
      //           element.image_arr = element.images.slice(0, 3);
      //         } else {
      //           element.image_arr = element.images;
      //         }
      //       } else {
      //         element.image_arr = [];
      //         element.total_image = element.image_arr.length;
      //       }
      //     });
      //     this.evaluationList = arr || [];
      //     console.log(this.evaluationList);
      //   } else {
      //     return false;
      //   }
      // });
      this.getEva()
    },
    getEva () {
      let obj;
      if (wx.getStorageSync("user_id")) {
        obj = {
          page: 1,
          pageSize: 2,
          project_id: this.mallId,
          flag: this.checkType,
          user_id: wx.getStorageSync("user_id")
        }
      } else {
        obj = {
          page: 1,
          pageSize: 2,
          project_id: this.mallId,
          flag: this.checkType,
          user_id: 0
        }
      }
      // 评论详情
      common.fly_post("api/v4_5/shop_project/comment_index", obj
        , msg => {
          let res = msg.data;
          if (res.status_code == 0) {
            let arr = res.data.data
            arr.forEach(element => {
              element.time = new Date(element.time * 1000).Format("yyyy-MM-dd");
              if (element.images) {
                element.image_arr = element.images;
                element.total_image = element.image_arr.length;
                // element.image_arr = element.image_arr.slice(0, 3);
                // console.log(element.image_arr)
              } else {
                element.image_arr = [];
                element.total_image = element.image_arr.length;
              }
            });
            this.evaluationList = res.data.data;
            this.evaluationNum = res.data.total;
          } else {
            common.mmk_Loading(2, res.message)
            return false;
          }
        })
    },
    djs () {
      let that = this;
      this.time1 = setInterval(() => {
        that.GetRTime();
      }, 1000);
    },
    GetRTime () {
      let now_time = Date.parse(new Date()) / 1000;
      let cha_timestamp = "";
      if (this.begin_time - now_time > 0) {
        cha_timestamp = this.begin_time - now_time;
        this.djs_type = "开抢倒计时";
        this.is_activity = true;
      } else {
        if (this.end_time == "") {
          return false;
        }
        if (this.end_time - now_time <= 0) {
          this.is_activity = false;
          this.mallList.activity_project = null;
          clearInterval(this.time1);
          return;
        } else {
          this.is_activity = true;
          cha_timestamp = this.end_time - now_time;
          this.djs_type = "距结束倒计时";
        }
        // cha_timestamp = this.end_time - now_time;
        //   this.djs_type = "距结束倒计时";
      }
      let sy_day = parseInt(cha_timestamp / (3600 * 24));
      if (sy_day < 10) {
        sy_day = "0" + sy_day;
      }
      let sy_hour = parseInt((cha_timestamp - sy_day * 3600 * 24) / 3600);
      if (sy_hour < 10) {
        sy_hour = "0" + sy_hour;
      }
      let sy_min = parseInt(
        (cha_timestamp - sy_hour * 3600 - sy_day * 24 * 3600) / 60
      );
      if (sy_min < 10) {
        sy_min = "0" + sy_min;
      }
      let sy_miao =
        cha_timestamp - sy_day * 3600 * 24 - sy_hour * 3600 - sy_min * 60;
      if (sy_miao < 10) {
        sy_miao = "0" + sy_miao;
      }
      this.minutes = [sy_day, sy_hour, sy_min, sy_miao];
    },
    // 提示框
    tips () {
      wx.showModal({
        title: "预约价",
        content:
          "预约价是预约咨询本项目的价格，预约成功后，既可以优惠价享受该项目服务",
        showCancel: false,
        confirmText: "知道了",
        confirmColor: "#FF98AA",
        success: function (res) {
          if (res.confirm) {
          }
        }
      });
    },
    //打电话
    call () {
      if (this.system_mark == "iOS") {
        wx.makePhoneCall({
          phoneNumber: "4006711314"
        });
      } else {
        wx.showModal({
          title: "",
          content: "400 671 1314",
          showCancel: true,
          cancelText: "取消",
          cancelColor: "#000000",
          confirmText: "呼叫",
          confirmColor: "#3CC51F",
          success: res => {
            if (res.confirm) {
              wx.makePhoneCall({
                phoneNumber: "4006711314"
              });
            } else if (res.cancel) {
            }
          }
        });
      }
    },
    //跳转立即预约
    tobooking_detail () {
      if (!wx.getStorageSync("user_token")) {
        //判断登录
        wx.navigateTo({ url: "/pages/package_main/login/main" });
        return false;
      } else {
        if (this.mallList.activity_project) {
          //抢购项目
          this.activity_project_status = 1;
        } else {
          this.activity_project_status = 0;
        }
        // 如果是“立即购买”就跳转到确认订单
        if (this.mallList.project_type == 1 || this.mallList.activity_project) {
          wx.navigateTo({
            url: `/pages/package_projects/comfirm_project_order/main?str=${
              this.mallId
              }&tg=${this.mallList.project_type}&activity_project_status=${
              this.activity_project_status
              }`
          });
        } else {
          // 跳转确认预约
          wx.navigateTo({
            url:
              "/pages/package_projects/confirm_booking/main?str=" +
              this.mallId +
              "&tg=" +
              this.mallList.project_type +
              "&activity_project_status=" +
              this.activity_project_status
          });
        }
      }
    },
    //跳转到全部反馈
    toEvaluation_detail (e) {
      wx.navigateTo({
        url: "/pages/package_mall/evaluation_detail/main?id=" + e
      });
    },
    // 推荐项目跳转
    toProjectDetail (item) {
      this.getData(item.id);
    },
    //收藏
    collect () {
      common.fly_post(
        "api/v4_5/beauty_project/collect",
        {
          type: 1,
          shop_id: this.mallId
        },
        result => {
          let res = result.data;
          if (res.status_code == 0) {
            if (this.iscollect) {
              this.iscollect = false;
              common.mmk_Loading(2, "取消收藏");
            } else {
              this.iscollect = true;
              common.mmk_Loading(2, "收藏成功");
            }
          } else {
            common.mmk_Loading(2, res.message);
            return false;
          }
        }
      );
    },
    //优惠券弹窗打开
    toTicketDetail () {
      this.ismark = true;
      this.ticket_mark = true;
    },
    //弹窗关闭
    closeTicketBox () {
      this.ismark = false;
      this.ticket_mark = false;
    },
    //点击领取优惠券
    beClooect (item) {
      if (wx.getStorageSync("user_id")) {
        item.tickets_is_set = true;
        common.fly_post(
          "api/v4_5/user_tickets/get_ticket",
          {
            id: item.id
          },
          msg => {
            let res = msg.data;
            if (res.status_code == 0) {
              this.collected = false;
              wx.showToast({
                title: "领取成功",
                icon: "none",
                duration: 2000,
                mask: true
              });
            } else {
              wx.showToast({
                title: res.message,
                icon: "none",
                duration: 2000,
                mask: true
              });
              return false;
            }
          }
        );
      } else {
        wx.showToast({
          title: "请您先登陆",
          icon: "none",
          duration: 2000,
          mask: true
        });
      }
    },
    scrollTab (e) {
      //tab栏
      this.scrollTop = e.mp.detail.scrollTop;
      this.tab_opacity = this.scrollTop / 400;
      if (this.scrollTop < 880) {
        this.type = 1;
      } else if (880 < this.scrollTop && this.scrollTop < 1200) {
        this.type = 3;
      } else if (this.scrollTop > 1200) {
        this.type = 2;
      }
      this.target = this.target == "" ? this.target : "";
    },
    infiniteScroll () { },
    scroll (e) { },
    //活动
    toPromotion (item) {
      common.to_detail(item);
    },
    get_info (e) {
      let that = this;

      if (wx.getStorageSync("user_token")) {
      }
      wx.getSetting({
        success: res => {
          if (res.authSetting["scope.userInfo"] === true) {
            // 已经授权，不会弹框
            // 成功授权
            if (wx.getStorageSync("user_token")) {
              // 登陆了
            } else {
              // 没登陆
              wx.showLoading({
                title: "正则获取用户资料", //提示的内容,
                mask: true, //显示透明蒙层，防止触摸穿透,
                success: res => { }
              });
              wx.login({
                success: result => {
                  common.fly_post(
                    "api/v4_5/minapp/login",
                    {
                      code: result.code,
                      iv: e.mp.detail.iv,
                      encryptedData: e.mp.detail.encryptedData,
                      avatarUrl: e.mp.detail.userInfo.avatarUrl,
                      nickName: e.mp.detail.userInfo.nickName,
                      sid: this.sid
                    },
                    response => {
                      wx.hideLoading();
                      let res = response.data;
                      if (res.status_code == 0) {
                        wx.navigateTo({
                          url:
                            "/pages/package_projects/confirm_booking/main?str=" +
                            this.mallId
                        });
                        wx.setStorageSync("user_token", res.data.token);
                        wx.setStorageSync("user_id", res.data.user_id);
                        wx.setStorageSync("open_id", res.data.user_jwt);
                        // console.log(12355, res.data.user.data.role_id);
                        wx.setStorageSync(
                          "role_id",
                          res.data.user.data.role_id
                        );
                        // console.log(444444, wx.getStorageSync("role_id"));
                      } else {
                        wx.hideLoading();
                        wx.showToast({
                          title: res.message,
                          icon: "none",
                          duration: 2000,
                          mask: false
                        });
                      }
                    }
                  );
                },
                fail: () => {
                  wx.showToast({
                    title: "登录失败", //提示的内容,
                    icon: "none", //图标,
                    duration: 1500, //延迟时间,
                    mask: true, //显示透明蒙层，防止触摸穿透,
                    success: res => { }
                  });
                }
              });
            }
          } else if (res.authSetting["scope.userInfo"] === false) {
            // 授权弹窗被拒绝
            wx.showToast({
              title: "授权被禁用，请前往设置", //提示的内容,
              icon: "none", //图标,
              duration: 2000, //延迟时间,
              mask: false, //显示透明蒙层，防止触摸穿透,
              success: res => {
                wx.openSetting({
                  success: res => { },
                  fail: res => { }
                });
              }
            });
          } else {
            // 没有弹出过授权弹窗
            wx.authorize({
              scope: "scope.userInfo",
              success: res => {
                that.islogin = true;
                that.url_path = "mine";
              },
              fail: () => { },
              complete: () => { }
            });
          }
        }
      });
    },
    go_home () {
      wx.switchTab({ url: "/pages/index/main" });
    },
    // 跳转保险页面
    ensure_detail () {
      wx.navigateTo({ url: "/pages/package_projects/ensure/main" });
    },
    toDoctor (e) {
      wx.navigateTo({
        url: `/pages/package_projects/doctordetail/main?id=${e}`
      });
    },
    toHospital (e) {
      wx.navigateTo({
        url: `/pages/package_projects/hospital_detail/main?hos_id=${e}`
      });
    },
    toMap (e) {
      console.log(e);

      wx.navigateTo({
        url: `/pages/package_projects/map/main?hosLat=${e.lat}&hosLng=${
          e.lng
          }&hosName=${e.name}`
      });
    },
    //轮播图点击变大图
    //轮播图预览
    tapBigImg (banners, index) {
      common.tapBigImg(banners, index);
    },
    beVip () {
      wx.reLaunch({
        url: `/pages/plus/main?lat=${this.lat}&lng=${this.lng}`
      });
    },
    // 展示分享
    show_share () {
      // this.show_postermask = true;
      console.log(11)
      this.ispop = true;
    },
    // close_share () {
    //   this.show_postermask = false;
    // },
    getSwiperMsg (e) {
      this.ispop = e
    }
  },
  onShareAppMessage () {
    return {
      title: this.mallname,
      path:
        "/pages/package_main/entry/main?tg=" +
        this.mallId +
        "&t=2&sid=" +
        this.sid,
      // path: "/pages/package_projects/project_detail/main?id=" + this.mallId,
      imageUrl: `${this.imgUrl}${this.mallList.image}`,
      from: "button",
      success: res => {
        wx.showToast({
          title: "分享成功",
          icon: "success",
          duration: 2000,
          mask: false
        });
      },
      fail: () => {
        wx.showToast({
          title: "分享失败",
          icon: "fail",
          duration: 2000,
          mask: false
        });
      },
      complete () {
        wx.showToast({
          title: "分享完成", //提示的内容,
          icon: "success", //图标,
          duration: 2000, //延迟时间,
          mask: false //显示透明蒙层，防止触摸穿透,
        });
      }
    };
  }
};
</script>
<style scoped lang="less">
.container {
  width: 100%;
  height: 100%;
  position: relative;
  background-color: #f3f4f6;
  .dv {
    width: 100%;
    height: 40px;
    padding-bottom: 16px;
    line-height: 60px;
    box-sizing: border-box;
    color: #fff;
    background: #fff;
    .dv_item {
      width: 72px;
      height: 24px;
      background: rgba(247, 247, 247, 1);
      border-radius: 13px;
      line-height: 24px;
      float: left;
      margin-right: 21px;
      box-sizing: border-box;
      text-align: center;
      color: rgba(102, 102, 102, 1);
      &.active {
        background: rgba(255, 115, 164, 0.1);
        border: 1px solid rgba(255, 115, 164, 1);
        color: rgba(255, 115, 164, 1);
        line-height: 22px;
      }
    }
  }
  #banner {
    background: #fff;
  }
  .jyb_details {
    font-size: 14px;

    font-weight: 500;
    line-height: 18px;
    display: flex;
    align-items: center;
    .icon {
      width: 15px;
      height: 15px;
      display: inline-block;
      margin-left: 8px;
      margin-right: 2px;
    }
  }
  .jb {
    color: rgba(245, 208, 64, 1);
    .icon {
      background: url("https://img.ameimeika.com/h5_images/mp_images/mp_3.1.6/mmk_3.1.6/gold_icon.png")
        0 bottom no-repeat;
      background-size: 15px 15px;
    }
  }
  .yb {
    color: rgba(165, 179, 185, 1);
    .icon {
      background: url("https://img.ameimeika.com/h5_images/mp_images/mp_3.1.6/mmk_3.1.6/silver_icon.png")
        0 bottom no-repeat;
      background-size: 15px 15px;
    }
  }
  .mall_bottom {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    font-size: 14px;
    font-family: PingFangSC-Regular, PingFang SC;
    font-weight: 400;
    color: rgba(153, 153, 153, 1);
    line-height: 16px;
    margin-top: 8px;
  }
  .plus_box {
    width: 351px;
    height: 30px;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    background: rgba(255, 213, 138, 0.5);
    border-radius: 6px;
    font-size: 12px;
    font-family: PingFangSC-Regular, PingFang SC;
    font-weight: 400;
    color: rgba(66, 30, 30, 1);
    line-height: 30px;
    margin-bottom: 12px;
    .icon {
      width: 12px;
      height: 9px;
      background: url("https://img.ameimeika.com/h5_images/mp_images/mp_3.1.6/mmk_3.1.6/details_ic_member@2x.png")
        0 0 no-repeat;
      background-size: 100% 100%;
      margin-right: 4px;
    }
  }
  .mask {
    width: 100%;
    height: 100%;
    position: absolute;
    background: rgba(0, 0, 0, 0.47);
    z-index: 999;
    .ticketBox {
      width: 100%;
      height: 279px;
      box-sizing: border-box;
      background-color: #fff;
      position: fixed;
      bottom: 0px;
      left: 0;
      border-radius: 5px;
      padding: 0 8px 10px 10px;
      .title {
        height: 44px;
        font-weight: 600;
        font-size: 14px;
        color: #333;
        line-height: 44px;
        text-align: center;
        position: relative;
        margin: 0 5px 5px;
        &::before {
          content: "";
          width: 98%;
          height: 0.5px;
          background-color: #e0e0e0;
          position: absolute;
          bottom: 0.5%;
          left: 0.5%;
        }
        .close {
          width: 40px;
          height: 44px;
          font-size: 30px;
          color: #666;
          position: absolute;
          right: 0;
        }
      }
      .list {
        width: 100%;
        height: 102px;
        background-image: url("https://h5.ameimeika.com/mp_images/mp_2.0/pinzhiyimei/youhuijuan1@2x.png");
        background-size: 100% 100%;
        background-repeat: no-repeat;
        display: flex;
        .list_left {
          width: 113px;
          box-sizing: border-box;
          font-size: 16px;
          text-align: center;
          color: #ff383e;
          padding-left: 5px;
          padding-top: 14px;
          .amount {
            font-size: 26px;
          }
          .amount1 {
            font-size: 12px;
            color: #666;
            padding-left: 8px;
          }
        }
        .list_mid {
          width: 173px;
          box-sizing: border-box;
          padding-left: 35px;
          padding-top: 15px;
          .text1 {
            font-size: 12px;
            color: #333;
            margin-bottom: 2px;
            line-height: 19px;
            .cash_ticket {
              width: 35px;
              height: 17px;
              line-height: 17px;
              box-sizing: border-box;
              font-size: 8px;
              background: rgba(254, 106, 156, 1);
              border-radius: 8.5px;
              color: #fff;
              margin-right: 5px;
              display: inline-block;
              text-align: center;
            }
          }
          .text2 {
            font-size: 10px;
            color: #666;
            margin-bottom: 4px;

            .red {
              display: inline-block;
              color: #f64665;
            }
          }
          .text3 {
            font-size: 10px;
            color: #888;
          }
        }
        .list_right {
          width: 70px;
          box-sizing: border-box;
          position: relative;
          .text1 {
            width: 24px;
            height: 34px;
            font-size: 12px;
            color: #fff;
            display: block;
            margin: 30px 0 0 22.5px;
          }
          .icon {
            width: 46px;
            height: 46px;
            position: absolute;
            left: 17%;
            top: 24%;
          }
        }
      }
    }
  }
  .tab {
    width: 100%;
    height: 45px;
    line-height: 45px;
    display: flex;
    background-color: #fff;
    position: fixed;
    top: 0;
    left: 0;
    box-shadow: 0 1px 6px 1px rgba(0, 0, 0, 0.06);
    z-index: 9999;
    .tab-item {
      flex: 1;
      font-size: 14px;
      font-family: "Regular";
      .msg {
        display: inline-block;
        font-size: 14px;
        font-family: "Regular";
        text-align: center;
        color: rgba(68, 68, 68, 1);
      }
      .active {
        color: rgba(246, 70, 101, 1);
        position: relative;
        &::before {
          content: "";
          width: 100%;
          height: 2px;
          background: rgba(246, 70, 101, 1);
          position: absolute;
          bottom: 0;
          left: 50%;
          transform: translateX(-50%);
        }
      }
      &:nth-of-type(1) {
        .msg {
          float: right;
          margin-right: 30px;
        }
      }
      &:nth-of-type(2) {
        position: relative;
        .msg {
          position: absolute;
          bottom: 0;
          left: 50%;
          transform: translateX(-50%);
        }
      }
      &:nth-of-type(3) {
        .msg {
          float: left;
          margin-left: 30px;
        }
      }
    }
  }
  .countdown {
    width: 100%;
    height: 58px;
    background: linear-gradient(
      315deg,
      rgba(230, 27, 100, 1) 0%,
      rgba(255, 56, 62, 1) 100%
    );
    color: #fff;
    position: relative;
    .left {
      height: 58px;
      width: auto;
      display: inline-block;
      box-sizing: border-box;
      padding: 9px 0 0 15px;
      color: #fff;
      .p1 {
        font-size: 14px;
        .num {
          font-size: 20px;
          font-weight: 500;
          font-family: STHeitiTC-Medium;
        }
      }
      .p2 {
        font-size: 10px;
        opacity: 0.7;
        .item1 {
          text-decoration: line-through;
        }
        .item2 {
          font-size: 14px;
          margin-right: 11px;
          text-decoration: line-through;
        }
      }
    }
    .right1 {
      color: #fff;
      font-size: 14px;
      text-align: center;
      width: 150px;
      position: absolute;
      right: 0;
      bottom: 7px;
      .title {
        text-align: center;
        font-size: 12px;
        margin: 0 43px 5px 0;
        letter-spacing: 1px;
      }
      .style1 {
        margin-right: 0;
      }

      .timer {
        margin-top: 5px;
        font-size: 14px;
        .item {
          border: solid 1px rgba(255, 255, 255, 0.5);
          display: inline-block;
          width: 19px;
          height: 19px;
          border-radius: 4px;
          .time_style {
            display: inline-block;
            padding: 0 3px;
          }
        }
      }
    }
  }
  .plusbox {
    width: 100%;
    background: #fff;
    text-align: center;
    .pluscard {
      width: auto;
      height: 35px;
      background: url("hhttps://img.ameimeika.com/h5_images/lifebeauty/3/tipsbg.png")
        no-repeat;
      background-size: 100% 100%;
      line-height: 35px;
      color: #fff;
      text-align: center;
      padding: 1px 7px;
      margin-top: 3px;
      font-size: 10px;
      display: inline-block;
      margin: 0 auto;
      position: relative;
      .btn1 {
        text-decoration: underline;
        display: inline-block;
        width: auto;
        height: 100%;
        margin-left: 30px;

        .rightnow {
          width: 22%;
          height: 100%;
          position: absolute;
          top: 0;
          right: 0;
          opacity: 0;
        }
      }
      .btn {
        text-decoration: underline;
        width: auto;
        height: 100%;
        margin-left: 30px;
        display: inline-block;
      }
    }
  }
}
.container .swiper {
  width: 100%;
  height: 375px;
  position: relative;
}
.imgsbox {
  width: 100%;
  height: auto;
  padding-bottom: 50px;
  box-sizing: border-box;
  .imgs {
    width: 100%;
    height: 100%;
    display: block;
  }
}
.check_img {
  width: 100%;
  margin: 12px 0;
  .header {
    margin: 0px auto 12px;
    width: 108px;
    height: 20px;
    background: url("https://img.ameimeika.com/h5_images/mp_images/mp_3.1.6/mmk_3.1.6/details_title.png")
      0 bottom no-repeat;
    background-size: 100% 100%;

    .left {
      text-align: center;
      font-size: 12px;
      font-family: "Regular";
      color: rgba(68, 68, 68, 1);
      background: #f2f2f2;
    }
  }
}

.slide-image {
  width: 100%;
  height: 100%;
}
/* 商品介绍样式 */
.mall {
  width: 100%;
  height: auto;
  padding: 0 15px 10px;
  box-sizing: border-box;
  position: relative;
  background-color: #fff;
  margin-bottom: 10px;
  border-radius: 0px 0px 10px 10px;
  .booking_price {
    height: 42px;
    font-size: 12px;
    color: #ff383e;
    position: relative;
    .booking_priceNum {
      font-size: 26px;
    }
    .bookimg {
      width: 13px;
      height: 13px;
    }
    .booked_star {
      width: auto;
      height: 20px;
      font-size: 10px;
      text-align: center;
      border-radius: 10px;
      color: #ff9345;
      position: absolute;
      right: 0;
      top: 30%;
      .booked1_star {
        width: 70px;
        height: 14px;
        overflow: hidden;
        display: inline-block;
        right: 1%;
        top: 8%;
        .little_star {
          width: 10px;
          height: 10px;
          float: left;
          // vertical-align: bottom;
        }
      }
      .star_box_num {
        margin-left: 6px;
        vertical-align: top;
        line-height: 14px;
        display: inline-block;
      }
    }
  }
  .project {
    font-size: 14px;
    color: #ff383e;
    .coin {
      font-size: 14px;
    }
    .num {
      font-size: 26px;
    }
  }
  .pay_type {
    height: 17px;
    font-size: 14px;
    color: #999;
    position: relative;
    margin-top: 5px;
    margin-bottom: 15px;
    display: flex;
    align-items: center;
    .origin {
      // text-decoration: line-through;
    }
    .booked1 {
      right: 0;
      position: absolute;
      top: 2%;
      color: #666;
      line-height: 17px;
      font-size: 12px;
    }
  }
  .mall_name {
    width: 100%;
    font-size: 17px;
    line-height: 24px;
    font-weight: 500;
    font-family: PingFangSC-Regular, PingFang SC;
    color: #333;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    margin-bottom: 5px;
    .icon_style {
      height: 16px;
      text-align: center;
      font-size: 12px;
      line-height: 16px;
      display: inline-block;
      border-radius: 2px;
    }
    .bao {
      width: 16px;
      color: #0070ff;
      border: 1px solid #0070ff;
      margin-right: 4px;
    }
    .jintie {
      width: 34px;
      color: #ff9d59;
      border: 1px solid #ff9d59;
    }
  }
  .mall_dec {
    height: auto;
    font-size: 12px;
    color: #999;
    font-weight: 400;
    // display: -webkit-box;
    // -webkit-box-orient: vertical;
    // -webkit-line-clamp: 2;
    // overflow: hidden;
  }
}
.sell_num {
  font-size: 12px;
  color: #888;
  position: absolute;
  right: 0;
  bottom: 1%;
}
// 促销条
.promotion {
  height: 60px;
  margin-bottom: 10px;
  background: rgba(201, 201, 201, 1);
  text-align: center;
  color: #fff;
  position: relative;
  .imgs {
    width: 100%;
    height: 60px;
    display: inline-block;
  }
  // .promotion-btn{
  //   width: 100%;
  //   height: 60px;
  //   background: transparent;
  //   position: absolute;
  //   top: 0;
  //   left: 0;
  // }
}
.baozhang {
  width: 100%;
  height: 60px;
  margin-bottom: 10px;
  background-color: #fff;
  position: relative;
  .tag {
    width: 80%;
    height: 100%;
    margin-left: 50px;
    .item {
      width: auto;
      height: 17px;
      font-size: 12px;
      line-height: 16px;
      margin: 10px 10px 10px 0px;
      color: #666;
      float: left;
      position: relative;
      .icon {
        width: 10px;
        height: 13px;
        display: inline-block;
        position: absolute;
        bottom: 10%;
      }
      .title {
        margin-left: 15px;
      }
    }
  }
  .text {
    font-size: 12px;
    text-align: left;
    color: #333;
    position: absolute;
    top: 10px;
    left: 0;
  }
  .img {
    width: 100%;
    height: 100%;
  }
}

.right {
  width: 24px;
  height: 24px;
  position: absolute;
  right: 2%;
  top: 20%;
}
.main {
  margin-bottom: 10px;
  margin-top: 10px;
  border-radius: 10px;
}
.hospital {
  width: 100%;
  height: auto;
  box-sizing: border-box;
  padding: 0 12px;
  background-color: #fff;
  margin-top: 10px;
  border-radius: 10px;
}
.hospital_details {
  padding: 22px;
  background: #fff;
  box-sizing: border-box;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  .listd {
    display: block;
    width: 50%;
    font-size: 12px;
    font-family: PingFangSC-Regular, PingFang SC;
    font-weight: 400;
    color: rgba(153, 153, 153, 1);
    line-height: 17px;
    margin-bottom: 8px;
    .num {
      color: rgba(102, 102, 102, 1);
    }
  }
}
.extraLevel {
  width: auto;
  height: 15px;
  font-size: 10px;
  color: #fff;
  line-height: 15px;
  padding: 0px 8px 0px 10px;
  text-align: right;
  background: rgba(255, 152, 108, 1);
  box-shadow: 0px 1px 1px 0px rgba(255, 91, 118, 0.42);
  border-radius: 7px;
  margin-left: 15px;
  // position: absolute;
  // right: 0;
  // top: 4%;
}
.extraLevel_item {
  position: relative;
}
.v-tip {
  width: 17px;
  height: 17px;
  border-radius: 50%;
  line-height: 15px;
  font-size: 12px;
  color: #fff;
  text-align: center;
  background: linear-gradient(
    314deg,
    rgba(255, 170, 105, 1) 0%,
    rgba(255, 57, 124, 1) 100%
  );
  box-shadow: 0px 1px 2px 0px rgba(255, 98, 117, 0.61);
  position: absolute;
  left: -17.5px;
  top: -4%;
}
.hos {
  width: 50px;
  box-sizing: border-box;
  margin-right: 5px;
  padding-top: 15px;
  display: inline-block;
}
.hos_right {
  flex: 100%;
  display: inline-block;
  position: relative;
  padding-top: 14px;
}
.hos-data {
  background: rgba(255, 115, 164, 0.04);
  border-radius: 10px;
  display: flex;
  flex-wrap: wrap;
  padding: 10px 10px 2px;
  margin-top: 12px;
  .data-item {
    width: 50%;
    height: 17px;
    margin-bottom: 8px;
    .item-l {
      display: inline-block;
      vertical-align: middle;
      font-size: 12px;
      font-family: "PingFangSC-Regular", "PingFang SC";
      font-weight: 400;
      color: rgba(153, 153, 153, 1);
      line-height: 17px;
    }
    .item-r {
      display: inline-block;
      vertical-align: middle;
      font-size: 12px;
      font-family: "PingFangSC-Regular", "PingFang SC";
      font-weight: 400;
      color: rgba(102, 102, 102, 1);
      line-height: 17px;
    }
  }
}
.hos_name {
  font-size: 16px;
  font-family: "PingFangSC-Medium", "PingFang SC";
  font-weight: bold;
  color: rgba(88, 88, 88, 1);
  line-height: 18px;
  display: flex;
}
.hospital_img {
  width: 50px;
  height: 50px;
  display: inline-block;
  // margin-top: 5px;
}
.address {
  height: auto;
  font-size: 12px;
  color: #666;
  display: flex;
  align-items: center;
  width: 100%;
  margin-top: 10px;
}
.address_icon {
  width: 28px;
  height: 16px;
  position: relative;
  background: url("https://img.ameimeika.com/h5_images/mp_images/mp_3.1.6/mmk_3.1.6/ic_position@3x.png")
    right center no-repeat;
  background-size: 16px 16px;
  background-position: right center;
}
.address_icon span {
  position: absolute;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
  width: 1.5px;
  height: 10px;
  background: #3EB0A9;
  display: block;
  opacity: 0.5;
}
// .address_left {
//   width: 9px;
// }
.address_right {
  flex: 1;
  padding: 0 2px;
  height: 100%;
  position: relative;
  font-size: 12px;
  font-family: PingFangSC-Regular, PingFang SC;
  font-weight: 400;
  color: rgba(153, 153, 153, 1);
  line-height: 16px;
  box-sizing: border-box;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  width: 295px;
}
.locate {
  width: 12px;
  height: 12px;
  margin-right: 5px;
  vertical-align: middle;
}

.doctor_num {
  background-color: #8f97ff;
}
.text {
  padding-left: 15px;
  background-color: #fff;
  padding-bottom: 9px;
}
.list1 {
  width: 100%;
  height: 141px !important;
  box-sizing: border-box;
  display: flex;
  overflow-x: auto;
  clear: both;
  padding-left: 15px;
  // padding-bottom: 10px!important;
  .item {
    width: 119px;
    height: 129px;
    margin-right: 10px;
    box-sizing: border-box;
    text-align: center;
    float: left;
    border: 1px solid rgba(237, 237, 237, 1);
    border-radius: 4px;
    position: relative;
    .item_img {
      // width:50px;
      height: 50px;
      margin: 10px auto 0px;
      display: inline-block;
      .img {
        width: 50px;
        height: 50px;
        border-radius: 50%;
        margin: 0px auto 2px;
      }
      .v-img {
        width: 13px;
        height: 13px;
        position: absolute;
        top: 37%;
        left: 58%;
      }
    }
    .text1 {
      font-size: 14px;
      color: #333;
    }
    .text2 {
      height: 17px;
      font-size: 12px;
      color: #999;
    }
    .booked_star {
      width: auto;
      height: 20px;
      line-height: 15px;
      font-size: 10px;
      text-align: center;
      border-radius: 10px;
      color: #ff9345;
      .booked1_star {
        width: 70px;
        height: 14px;
        overflow: hidden;
        display: inline-block;
        right: 1%;
        top: 8%;
        .little_star {
          width: 14px;
          height: 14px;
          // margin-right: 2px;
          vertical-align: bottom;
        }
      }
      .star_box_num {
        margin-left: 6px;
        vertical-align: top;
        line-height: 16px;
        display: inline-block;
      }
    }
  }
  .item2 {
    // width: 10px!important;
    // height: 129px;
    // margin-right: 10px;
    // float: left;
    border: 1px solid #fff;
  }
}
/* 推荐项目样式 */
.reference_project_title {
  font-size: 12px;
  font-family: PingFangSC-Medium, PingFang SC;
  font-weight: 500;
  color: rgba(51, 51, 51, 1);
  line-height: 17px;
  padding: 12px;
  box-sizing: border-box;
  background: #fff;
}
.reference_project_ul {
  border-radius: 0 0 10px 10px;
  box-sizing: border-box;
  padding: 0 12px;
  clear: both;
  width: 100%;
  display: flex;
  overflow-x: auto;
  background-color: #fff;
  .jyb_details {
    font-size: 12px;
    font-weight: 500;
    color: rgba(102, 102, 102, 1);
    line-height: 18px;
    margin-bottom: 14px;
    .icon {
      margin-left: 0;
      width: 14px;
      height: 14px;
    }
    .jb,
    .yb {
      color: rgba(102, 102, 102, 1);
    }
    .jb {
      .icon {
        background: url("https://img.ameimeika.com/h5_images/mp_images/mp_3.1.6/mmk_3.1.6/gold_icon.png")
          0 bottom no-repeat;
        background-size: 100% 100%;
      }
    }
    .yb {
      .icon {
        background: url("https://img.ameimeika.com/h5_images/mp_images/mp_3.1.6/mmk_3.1.6/silver_icon.png")
          0 bottom no-repeat;
        background-size: 100% 100%;
      }
    }
  }

  .booked_star {
    width: auto;
    height: 20px;
    line-height: 15px;
    font-size: 10px;
    text-align: center;
    border-radius: 10px;
    color: #ff9345;
    .booked1_star {
      right: 1%;
      color: #fa8c85;
      top: 8%;
      .little_star {
        width: 16px;
        height: 16px;
        // margin-right: 2px;
        vertical-align: bottom;
      }
    }
    .star_box_num {
      margin-left: 6px;
      vertical-align: top;
      line-height: 14px;
      display: inline-block;
    }
  }
}
.reference_project_li {
  float: left;
}
.reference_project {
  width: 114px;
  height: 114px;
  background: rgba(230, 230, 230, 1);
  border-radius: 6px;
  display: inline-block;
  margin: 0px 12px 4px 0px;
  position: relative;
  // &.item_img{
  // width: 50px;
  // height: 50px;

  // }
}

.pro_img {
  width: 114px;
  height: 114px;
  background: rgba(230, 230, 230, 1);
  border-radius: 6px;
}
.reference_project_name {
  width: 100px;
  display: inline-block;
  font-size: 12px;
  color: #333;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 1;
  line-clamp: 1;
  -webkit-box-orient: vertical;
}

.reference_project_price {
  width: 100px;
  font-size: 10px;
  font-weight: 400;
  color: rgba(255, 56, 62, 1);
  line-height: 22px;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 1;
  line-clamp: 1;
  -webkit-box-orient: vertical;
  .big {
    font-size: 16px;
    font-weight: 500;
  }
}
.reference_project_price .appointment_price {
  color: #ff383e;
}
.buyingImg {
  width: 44px;
  height: 17px;
  line-height: 17px;
  background: linear-gradient(
    315deg,
    rgba(230, 27, 100, 1) 0%,
    rgba(255, 56, 62, 1) 100%
  );
  border-radius: 4px;
  position: absolute;
  z-index: 1;
  color: #fff;
  text-align: center;
  font-size: 10px;
  bottom: 6px;
  right: 6px;
}
/* 优惠券 */
.ticket_box {
  width: 100%;
  background: rgba(255, 255, 255, 1);
  border-radius: 10px;
  margin-top: 10px;
  overflow: hidden;
  .icon {
    display: inline-block;
    width: 12px;
    height: 12px;
    margin-right: 4px;
    background: url("https://img.ameimeika.com/h5_images/mp_images/mp_3.1.6/mmk_3.1.6/ic_guarantee.png")
      0 bottom no-repeat;
    background-size: 100% 100%;
  }
  .bz_box {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
  }
  .list {
    margin-right: 16px;
    line-height: 22px;
  }
  .line {
    width: 305px;
    height: 1.5px;
    background: rgba(245, 245, 245, 1);
    margin-left: 70px;
  }
}
.ticket {
  height: 48px;
  box-sizing: border-box;
  line-height: 48px;
  display: flex;
  align-items: center;
  padding: 0 12px;
  font-size: 14px;
  color: #333;
  background-color: #fff;
  position: relative;
}
.tic_img {
  width: 42px;
  font-size: 14px;
  font-family: PingFangSC-Regular, PingFang SC;
  font-weight: 400;
  color: rgba(153, 153, 153, 1);
  margin-right: 20px;
}
/* 评价样式 */
.evaluation {
  height: auto;
  padding: 0 15px;
  background-color: #fff;
  position: relative;
  border-radius: 5px;
}
.evaluation_item {
  width: 100%;
  height: auto;
  padding: 10px 0 12px;
  clear: both;
  position: relative;
  border-bottom: 1px solid rgba(245, 245, 245, 1);
}
.user_evaluation {
  height: 44px;
  line-height: 44px;
  font-size: 14px;
  font-weight: 600;
  color: #444;
  position: relative;
}
.check_evaluation {
  font-weight: 400;
  color: #666;
  position: absolute;
  right: -2%;
  top: 0;
}
.evaluation_icon {
  width: 12px;
  height: 12px;
  vertical-align: middle;
  margin-bottom: 2px;
}
.user_info {
  width: 100%;
  height: 30px;
  padding: 0;
  position: relative;
  display: flex;
  align-items: center;
}
.user_img {
  width: 30px;
  height: 30px;
  border-radius: 50%;
  margin-right: 6px;
}
.user_info .user_name {
  font-size: 12px;
  color: #333;
  margin-bottom: 5px;
}
.evaluation_time {
  color: #999;
  font-size: 12px;
  position: absolute;
  left: 13%;
  top: 49%;
}
.content_main {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  margin: 12px 0px 0;
}
.evaluation_content {
  flex: 1;
  height: auto;
  clear: both;
  font-size: 14px;
  color: #333;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
  &.active {
    -webkit-line-clamp: 3;
  }
}
/* 评价照片 */
.evaluationIMG_li_item {
  width: 60px;
  height: 60px;
  background: rgba(230, 230, 230, 1);
  border-radius: 4px;
  display: block;
  clear: both;
  position: relative;
}
.evaluationIMG_li {
  width: 60px;
  height: 60px;
}
.evaluationIMG {
  width: 60px;
  height: 60px;
  margin-left: 12px;
  position: relative;
}
.tip {
  height: 14px;
  background: rgba(0, 0, 0, 0.3);
  border-radius: 7px;
  line-height: 14px;
  padding: 0 4px;
  font-family: "PingFangSC-Medium";
  color: #fff;
  position: absolute;
  right: 4px;
  bottom: 4px;
  z-index: 999;
  font-size: 10px;
}
.likeStyle {
  height: 14px;
  line-height: 14px;
  font-size: 12px;
  color: #666;
  margin-top: 11px;
  text-align: right;
}
.likeImg {
  width: 13px;
  height: 14px;
  vertical-align: bottom;
}
/* 项目详情 */
.project_detail {
  height: 44px;
  line-height: 44px;
  font-size: 14px;
  color: #444;
  padding: 0 15px;
}
.project_detail_img {
  height: 527px;
  width: 100%;
  padding-bottom: 40px;
}
.project_detail_item {
  height: 527px;
  width: 100%;
  display: block;
}
.go_home {
  width: 50px;
  height: 50px;
  position: fixed;
  bottom: 70px;
  right: 10px;
}
/* 底部 */
.bottom {
  width: 100%;
  height: 49px;
  position: fixed;
  bottom: 0;
  left: 0;
  background-color: #fff;
  z-index: 99;
}
.btn {
  height: 49px;
  width: 100%;
}
.tel,
.consult {
  width: 49px;
  height: 100%;
  font-size: 12px;
  color: #666;
  display: inline-block;
  text-align: center;
  line-height: 75px;
  position: relative;
  .contact {
    display: block;
    padding: 0;
    margin: 0;
    outline: none;
    width: 100%;
    height: 100%;
    position: absolute;
    opacity: 0;
    z-index: 10;
    top: 0;
    left: 0;
  }
}
.consult {
  position: relative;
}
.shareicon {
  width: 19px;
  height: 19px;
}
.tel_icon {
  width: 31px;
  height: 31px;
  position: absolute;
  top: 5%;
  left: 50%;
  transform: translateX(-50%);
}
.consult_icon {
  width: 20px;
  height: 20px;
  position: absolute;
  top: 10%;
  left: 50%;
  transform: translateX(-50%);
}
.consult_icon {
  top: 15%;
  right: 60%;
}
.booking_btn {
  margin-top: 5px;
  text-align: center;
  width: 212px;
  height: 38px;
  background: linear-gradient(
    226deg,
    rgba(254, 120, 161, 1) 0%,
    rgba(254, 123, 136, 1) 100%
  );
  border-radius: 19px;
  font-size: 14px;
  font-family: PingFangSC-Medium, PingFang SC;
  font-weight: 500;
  color: rgba(255, 255, 255, 1);
  line-height: 38px;
  float: right;
  margin-right: 10px;
}
.userinfo-btn {
  position: absolute;
  width: 48%;
  height: 100%;
  background-color: transparent;
  right: 0;
  bottom: 0;
  z-index: 999;
}
.star {
  width: auto;
  height: 20px;
  display: inline-block;
  font-size: 10px;
  color: #ff9345;
}
.star_box {
  width: 70px;
  height: 14px;
  overflow: hidden;
  display: inline-block;
  //  margin-right: 4px;
  .little_star {
    width: 10px;
    height: 10px;
    float: left;
    margin-right: 3px;
  }
}
.star_box_num {
  margin-left: 6px;
  vertical-align: top;
  line-height: 14px;
  display: inline-block;
}

/* 收藏样式 */
.btns {
  width: auto;
  height: 32px;
  display: flex;
  position: absolute;
  top: 0;
  right: 1%;
  margin-top: 15px;
  z-index: 10000;
}
.collect,
.share {
  display: block;
}
.share {
  width: 22%;
  height: 100%;
  text-align: center;
  margin: 0 15px 0 10px;
  outline: none;
  border: none;
  padding-top: 6px;
  color: #666;
  font-size: 12px;
  position: relative;
  .bttomshare {
    width: 100%;
    height: 100%;
    position: absolute;
    opacity: 0;
    top: 0;
    left: 0;
  }
}
.share1 {
  width: 32px;
  height: 32px;
  background: url("https://h5.ameimeika.com/mp_images/jifenshangcheng/xiangqingye/fenxiang@2x.png")
    no-repeat center;
  background-size: cover;
}
.share::after {
  border: none;
}
.image {
  width: 32px;
  height: 32px;
  display: inline-block;
}

//   分享
.share-mask {
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.6);
  position: fixed;
  top: 0;
  left: 0;
  z-index: 99999;
  .share-top {
    width: 100%;
    display: block;
  }
  .share-model {
    width: 240px;
    margin: 20px auto 0;
    .poster {
      width: 100%;
      display: block;
    }
  }
}
</style>


